{%extends "cms/base/base.html" %} {% block content %}
<link rel="stylesheet" type="text/css" href="/site_media/js/uploadify_31/uploadify.css" />
<link rel="stylesheet" type="text/css" href="/site_media/js/prettyPhoto3.1.4/css/prettyPhoto.css" />
<style type="text/css">
<!--
ul,li{padding:0px; margin:0px; list-style:none;}
.s_photos{margin:25px 10px 0 45px; width:900px; overflow:hidden;}
.s_photos ul li{float:left; width:188px; border:#d4d4d4 1px solid; padding:5px; background:#ffffff;position:relative; margin:0px 20px 20px 0px;}
.s_photos_img{height:auto; overflow:hidden;}
.s_photos_text{line-height:24px; text-align:center; float:left; }
.s_links{margin-top:-20px;}
.s_links ul li{border-bottom:#9C9C9C 1px dashed; padding:20px 0px;}
.s_links_img{ border:#d4d4d4 1px solid; padding:4px; width:150px; height:80px; background:#ffffff; float:left;}
.s_links_text{width:400px; float:right; }
.s_links_text p{margin:0px; padding:0px;}
.s_links_t01 a{ font-weight:bold; text-decoration:none;}
.s_links_t03{line-height:20px; margin-top:10px;}
.upload-box{margin:0 10px 0 45px;}
.uploadifyQueue{
	background-color: white;
	border-radius: 3px;
	box-shadow: 0 1px 3px 
	rgba(0, 0, 0, 0.25);
	min-height:100px;
	height:auto;
	margin-bottom: 10px;
	overflow: auto;
	padding: 5px 10px;
	width: 350px;
}
-->
</style>
<!-- start content -->
<div id="content">
	<!--  start content-table-inner ...................................................................... START -->
	<div id="content-table-inner">
		<div class="s_photos">
	         <ul class="gallery clearfix">
	         	{% for photo in photo_list %}
	         		<li>
		                <a class="s_photos_img" href="/site_photos/{{ photo.image }}" rel="prettyPhoto[gallery]"><img src="/site_photos/{{ photo.thumbnail }}" /></a><!--img -->
		           </li>
	         	{% endfor %}
	         </ul>
	         <div class="clear"></div>
	      </div><!--图 -->
		<div class="upload-box">  
		    <input type="file" name="Filedata" id="file_upload" />
		    <div id="file_uploadQueue" class="uploadifyQueue"></div>
		    <div><input type="button" value="" class="form-submit" onclick="uploadImg();" /></div>
		</div>
	</div>
	<!--  end content-table-inner ............................................END  -->
	<div class="clear">&nbsp;</div>
</div>
<script src="/site_media/js/cms/ui.core.js" type="text/javascript"></script>
<script src="/site_media/js/uploadify_31/jquery.uploadify-3.1.min.js" type="text/javascript"></script>
<script src="/site_media/js/prettyPhoto3.1.4/js/jquery.prettyPhoto.js" type="text/javascript"></script>
<script type="text/javascript">
jQuery(document).ready(function() {
    $('#file_upload').uploadify({
        'swf' : '/site_media/js/uploadify_31/uploadify.swf',
        'uploader' : '/admin/uploadImg/{{ folder }}/',
        'buttonClass' : 'btn',
        'fileDesc': '图片文件',
        'fileTypeExts' : '*.jpg;*.gif;*.png;*.jpeg',
        'multi' : true,
        'queueID' : 'file_uploadQueue',
        'buttonText': '添加图片',
        'auto': false,
        'width':90,
        'removeCompleted': false,
        'onUploadSuccess' : function (file, data, response) {
        	loadImage(data);
        }
    });
    //image gallery
    $(".gallery a[rel^='prettyPhoto']").prettyPhoto({animation_speed:'normal',theme:'light_square',slideshow:3000, autoplay_slideshow: true});
});
function uploadImg() {
	//$('#file_upload').uploadify('settings','uploader','/admin/upload/' + 'tmp/');
	$('#file_upload').uploadify('upload','*');
}

function loadImage(src) {
	var image_html = '<li><div class="s_photos_img">';
	image_html += '<img src="/site_photos/' + src + '" />';
	image_html += '</div>';
	image_html += '</li>';
	$(".s_photos ul").append(image_html);
}
</script>

<!--  end content -->
{% endblock %}
